.Heteroaxis {
  height: 75vh;
  width: 100%;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
  align-items: center;
  z-index: -99;

  .Heteroaxis-top {
    width: 100%;
    height: 50%;
    // background-color: #0076f6;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    margin-top: -0.5rem;

    .Heteroaxis-top-time {
      width: 100%;
      height: 15%;
      display: flex;
      justify-content: flex-start;
      align-items: center;

      .Heteroaxis-top-time-picker {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;

        .ant-picker,
        .ant-select {
          width: 245px;
        }
      }
    }

    .Heteroaxis-top-eachers {
      width: 100%;
      height: 85%;
      background-color: #fafcff;
      border-left: 3px solid #0076f6;
    }
  }

  .Heteroaxis-bottom {
    width: 100%;
    height: 50%;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;

    // background-color:#ff8d1a;
    .Heteroaxis-bottom-time {
      width: 100%;
      height: 15%;
      display: flex;
      justify-content: flex-start;
      align-items: center;

      .Heteroaxis-bottom-time-picker {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;

        .ant-picker,
        .ant-select {
          width: 245px;
        }
      }
    }

    .Heteroaxis-bottom-eachers {
      width: 100%;
      height: 85%;
      background-color: #fafcff;
      border-left: 3px solid #ff8d1a;
    }
  }
}
